import 'package:WebTest/chooseFood/core/model/meal_model.dart';
import 'package:WebTest/chooseFood/ui/pages/detail/detail.dart';
import 'package:WebTest/chooseFood/ui/widgets/operation_item.dart';
import 'package:flutter/material.dart';
import '../../../screenLayout/size_fit.dart';

class BDMealItem extends StatelessWidget {
  final cardRadius = 12.px;
  final BDMealModel model;

  BDMealItem(this.model);

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      child: Card(
//        color: Colors.white,
        margin: EdgeInsets.all(10.px),
        elevation: 5,
        shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.circular(cardRadius),
        ),
        child: Column(
          children: <Widget>[buildBaseInfo(context), buildOperationInfo()],
        ),
      ),
      onTap: () {
        Navigator.of(context)
            .pushNamed(BDDetailScreen.routerName, arguments: model);
      },
    );
  }

  Widget buildBaseInfo(BuildContext context) {
    return Stack(
      children: <Widget>[
        ClipRRect(
          borderRadius: BorderRadius.only(
            topLeft: Radius.circular(cardRadius),
            topRight: Radius.circular(cardRadius),
          ),
          child: Image.network(
            model.imageUrl,
            width: double.infinity,
            height: 300.px,
            fit: BoxFit.cover,
          ),
        ),
        Positioned(
          right: 10.px,
          bottom: 10.px,
          child: Container(
            padding: EdgeInsets.symmetric(vertical: 5.px, horizontal: 10.px),
            width: 300.px,
            decoration: BoxDecoration(
              color: Colors.black54,
              borderRadius: BorderRadius.circular(6.px),
            ),
            child: Text(
              model.title,
              style: Theme.of(context)
                  .textTheme
                  .headline2
                  .copyWith(color: Colors.white),
            ),
          ),
        )
      ],
    );
  }

  Widget buildOperationInfo() {
    return Padding(
      padding: EdgeInsets.all(16.0.px),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceAround,
        children: <Widget>[
          BDOperationItem(Icon(Icons.schedule), "${model.duration}分钟"),
          BDOperationItem(
              Icon(Icons.restaurant), "${model.complexityString}"),
          BDOperationItem(Icon(Icons.favorite), "未收藏"),
        ],
      ),
    );
  }
}
